{
  "nbformat": 4,
  "nbformat_minor": 0,
  "metadata": {
    "colab": {
      "name": "01_Local_Setup",
      "provenance": [],
      "collapsed_sections": []
    },
    "kernelspec": {
      "name": "python3",
      "display_name": "Python 3"
    }
  },
  "cells": [
    {
      "cell_type": "markdown",
      "metadata": {
        "id": "BU6jYKxS7jIy",
        "colab_type": "text"
      },
      "source": [
        "# Local Setup\n",
        "\n",
        "In this lesson we'll move away from using Google Colab and setting things up on our own local machines. We need to do this because the rest of the production ML lessons won't work on Google colab. "
      ]
    },
    {
      "cell_type": "markdown",
      "metadata": {
        "id": "IrxSN7WwBCNy",
        "colab_type": "text"
      },
      "source": [
        "<div align=\"left\">\n",
        "<a href=\"https://github.com/madewithml/lessons/blob/master/notebooks/03_APIs/01_Local_Setup.ipynb\" role=\"button\"><img class=\"notebook-badge-image\" src=\"https://img.shields.io/static/v1?label=&amp;message=View%20On%20GitHub&amp;color=586069&amp;logo=github&amp;labelColor=2f363d\"></a>&nbsp;\n",
        "<a href=\"https://colab.research.google.com/github/madewithml/lessons/blob/master/notebooks/03_APIs/01_Local_Setup.ipynb\"><img class=\"notebook-badge-image\" src=\"https://colab.research.google.com/assets/colab-badge.svg\" alt=\"Open In Colab\"></a>\n",
        "</div>"
      ]
    },
    {
      "cell_type": "markdown",
      "metadata": {
        "id": "BVmpQLg_K_eH",
        "colab_type": "text"
      },
      "source": [
        "# Visual Studio"
      ]
    },
    {
      "cell_type": "markdown",
      "metadata": {
        "id": "WWALt2mMZvwh",
        "colab_type": "text"
      },
      "source": [
        "My integrated development environment (IDE) of choice is [Visual Studio Code](https://code.visualstudio.com/?wt.mc_id=vscom_downloads). I've used Sublime, Atom, PyCharm and many others in the past but VSCode is my favorite so far both in terms of a rich ecosystem of extensions and development speed. \n",
        "\n",
        "**NOTE**: Feel free to skip this section if you already have VSCode installed or if you're fine using another IDE. I prefer VSCode for some of the useful extensions it offers (detailed below)."
      ]
    },
    {
      "cell_type": "markdown",
      "metadata": {
        "id": "rAYbXUepMI3g",
        "colab_type": "text"
      },
      "source": [
        "### Download"
      ]
    },
    {
      "cell_type": "markdown",
      "metadata": {
        "id": "iYmKXZrCZvCU",
        "colab_type": "text"
      },
      "source": [
        "You can download Visual Studio Code at this [link](https://code.visualstudio.com/?wt.mc_id=vscom_downloads). Once you have VSCode installed, open it and play around with it a bit. You can open VSCode from the terminal by just typing `code`. Feel free to explore the basics using these [intro videos](https://code.visualstudio.com/docs/getstarted/introvideos)."
      ]
    },
    {
      "cell_type": "markdown",
      "metadata": {
        "id": "FGIMuY8UMI5-",
        "colab_type": "text"
      },
      "source": [
        "### Settings"
      ]
    },
    {
      "cell_type": "markdown",
      "metadata": {
        "id": "nyj_yFBrbPEn",
        "colab_type": "text"
      },
      "source": [
        "1.   Go to **Code** > **Preferences** > **Color** Theme and choose your code's color theme (I use Monokai). \n",
        "2.   Go to **Code** > **Preferences** > **File Icon Theme** and choose how you want your file icons to look (I use Material Icon Theme).\n",
        "3. Now press Command (or Ctrl) + Shift + P and type in `Preferences: Open Settings (JSON)`. Click the first option that is recommended. On this page, you'll paste the following settings:\n",
        "```\n",
        "{\n",
        "    \"workbench.iconTheme\": \"material-icon-theme\",\n",
        "    \"editor.tabSize\": 4,\n",
        "    \"files.trimTrailingWhitespace\": true,\n",
        "    \"editor.formatOnPaste\": true,\n",
        "    \"editor.multiCursorModifier\": \"ctrlCmd\",\n",
        "    \"editor.snippetSuggestions\": \"top\",\n",
        "    \"editor.wordWrapColumn\": 40,\n",
        "    \"python.formatting.provider\": \"autopep8\",\n",
        "    \"python.linting.enabled\": true,\n",
        "    \"python.linting.pycodestyleEnabled\": true,\n",
        "    \"python.terminal.activateEnvironment\": false,\n",
        "    \"editor.renderWhitespace\": \"all\",\n",
        "    \"[javascript]\": {\n",
        "        \"editor.defaultFormatter\": \"esbenp.prettier-vscode\",\n",
        "        \"editor.tabSize\": 2\n",
        "    },\n",
        "    \"[html]\": {\n",
        "        \"editor.defaultFormatter\": \"vscode.html-language-features\",\n",
        "        \"editor.tabSize\": 2\n",
        "    },\n",
        "    \"window.zoomLevel\": 0,\n",
        "    \"editor.fontSize\": 14,\n",
        "    \"[css]\": {\n",
        "        \"editor.tabSize\": 2\n",
        "    },\n",
        "    \"liveSassCompile.settings.formats\": [\n",
        "        {\n",
        "            \"format\": \"expanded\",\n",
        "            \"extensionName\": \".css\",\n",
        "            \"savePath\": \"~/../css/\"\n",
        "        }\n",
        "    ],\n",
        "    \"workbench.colorTheme\": \"Monokai\"\n",
        "}\n",
        "```\n",
        "These are my settings (# of spaces for indentation based on file extension, etc.) Feel free to change it as you wish.\n",
        "\n"
      ]
    },
    {
      "cell_type": "markdown",
      "metadata": {
        "id": "Q_U7it7rMRGf",
        "colab_type": "text"
      },
      "source": [
        "### Extensions"
      ]
    },
    {
      "cell_type": "markdown",
      "metadata": {
        "id": "opYBwyAeeMD-",
        "colab_type": "text"
      },
      "source": [
        "We're also going to install some very useful extensions. You can search for them using the **Extensions** icon on the left panel but you can also download them via the command line. Here are the ones I recommend.\n",
        "```\n",
        "code --list-extensions | xargs -L 1 echo code --install-extension\n",
        "code --install-extension 74th.monokai-charcoal-high-contrast\n",
        "code --install-extension alefragnani.project-manager\n",
        "code --install-extension bierner.markdown-preview-github-styles\n",
        "code --install-extension bradgashler.htmltagwrap\n",
        "code --install-extension christian-kohler.path-intellisense\n",
        "code --install-extension CoenraadS.bracket-pair-colorizer-2\n",
        "code --install-extension euskadi31.json-pretty-printer\n",
        "code --install-extension formulahendry.auto-close-tag\n",
        "code --install-extension formulahendry.auto-rename-tag\n",
        "code --install-extension kamikillerto.vscode-colorize\n",
        "code --install-extension mechatroner.rainbow-csv\n",
        "code --install-extension mikestead.dotenv\n",
        "code --install-extension mohsen1.prettify-json\n",
        "code --install-extension ms-azuretools.vscode-docker\n",
        "code --install-extension ms-kubernetes-tools.vscode-kubernetes-tools\n",
        "code --install-extension ms-python.python\n",
        "code --install-extension ms-vscode.sublime-keybindings\n",
        "code --install-extension njpwerner.autodocstring\n",
        "code --install-extension PKief.material-icon-theme\n",
        "code --install-extension redhat.vscode-yaml\n",
        "code --install-extension ritwickdey.live-sass\n",
        "code --install-extension ritwickdey.LiveServer\n",
        "code --install-extension shardulm94.trailing-spaces\n",
        "code --install-extension streetsidesoftware.code-spell-checker\n",
        "```"
      ]
    },
    {
      "cell_type": "markdown",
      "metadata": {
        "id": "6e2e4odRLDKH",
        "colab_type": "text"
      },
      "source": [
        "# Python 3"
      ]
    },
    {
      "cell_type": "markdown",
      "metadata": {
        "id": "xZ8p4RwbfM-4",
        "colab_type": "text"
      },
      "source": [
        "We will be using Python 3.x. There are many resources online for downloading Python 3 for your machine but this [post](https://realpython.com/installing-python/) is fairly comprehensive. Once you have it installed, you can use the terminal window directly inside VSCode or just use a seprate terminal window."
      ]
    },
    {
      "cell_type": "markdown",
      "metadata": {
        "id": "lVfLrTRMLE-k",
        "colab_type": "text"
      },
      "source": [
        "# Miscellaneous"
      ]
    },
    {
      "cell_type": "markdown",
      "metadata": {
        "id": "Pntc95vQLisU",
        "colab_type": "text"
      },
      "source": [
        "### matplotlib RuntimeError on Mac OSX\n",
        "When you run matplotlib for the first time on Mac OSX, you may see the following error:\n",
        "\n",
        "    **RuntimeError**: Python is not installed as a framework. The Mac OS X backend will not be able to function correctly if Python is not installed as a framework. See the Python documentation for more information on installing Python as a framework on Mac OS X. Please either reinstall Python as a framework, or try one of the other backends.\n",
        "\n",
        "Run the command below to resolve this issue:\n",
        "```bash\n",
        "echo \"backend: TkAgg\" >> ~/.matplotlib/matplotlibrc\n",
        "```"
      ]
    },
    {
      "cell_type": "markdown",
      "metadata": {
        "id": "_OBWXWn5MbBu",
        "colab_type": "text"
      },
      "source": [
        "---\n",
        "Share and discover ML projects at <a href=\"https://madewithml.com/\">Made With ML</a>.\n",
        "\n",
        "<div align=\"left\">\n",
        "<a class=\"ai-header-badge\" target=\"_blank\" href=\"https://github.com/madewithml/lessons\"><img src=\"https://img.shields.io/github/stars/madewithml/lessons.svg?style=social&label=Star\"></a>&nbsp;\n",
        "<a class=\"ai-header-badge\" target=\"_blank\" href=\"https://www.linkedin.com/company/madewithml\"><img src=\"https://img.shields.io/badge/style--5eba00.svg?label=LinkedIn&logo=linkedin&style=social\"></a>&nbsp;\n",
        "<a class=\"ai-header-badge\" target=\"_blank\" href=\"https://twitter.com/madewithml\"><img src=\"https://img.shields.io/twitter/follow/madewithml.svg?label=Follow&style=social\"></a>\n",
        "</div>\n",
        "             "
      ]
    }
  ]
}